import React from 'react';
import {Link, useLocation} from 'react-router-dom';
import {NoInfoError} from '../components/NoInfoError';
import HeightWrapper from '../components/HeightWrapper';
import {Button} from '../components/Button';
import styled from 'styled-components';

const ButtonWrapper = styled.div`
  position: fixed;
  bottom: 128px;
  left: 50%;
  transform: translateX(-50%);
`

function NoMatch() {
  let location = useLocation();
  return (
    <HeightWrapper>
      <NoInfoError text={location.pathname + ' 不是有效路径'} />
      <ButtonWrapper>
        <Link to="/money">
          <Button>返回记账</Button>
        </Link>
      </ButtonWrapper>
    </HeightWrapper>
  );
}

export default NoMatch;